<?php
require_once dirname(__FILE__) . '/../../../incls/php/dbutils.class.php';
require_once dirname(__FILE__) . '/../../../incls/php/miscutils.class.php';
$myPdo = DbUtils::createPdoInst();
$inst_id = MiscUtils::getParam('inid', 0);
$comp_track_id = MiscUtils::getParam('t', 0);
$cond_vals = new stdClass();
$cond_vals->c = 'comp_track_id = :v1';
$cond_vals->v = array(':v1' => $comp_track_id);
$items = DbUtils::get($myPdo, TABLE_NAME_PREFIX_PLUGIN . 'comp_prize', $cond_vals, 't.order_number', 'ASC', NULL, NULL, NULL)->d;
?>
<!DOCTYPE html>
<html>
<head>

  <meta charset="utf-8">

  <!-- Required CSS -->
  <link href="assets/css/movingboxes.css" media="screen" rel="stylesheet">
  <!--[if lt IE 9]>
  <link href="css/movingboxes-ie.css" rel="stylesheet" media="screen" />
  <![endif]-->

  <!-- Required script -->
  <script type="text/javascript" src="../../../libs/jquery/jquery-1.6.2.min.js"></script>
  <script src="assets/js/jquery.movingboxes.js"></script>

  <!-- Demo only -->
  <link href="assets/demo/demo.css" media="screen" rel="stylesheet">
  <script src="assets/demo/demo.js"></script>
  <style>
    /* Overall & panel width defined using css in MovingBoxes version 2.2.2+ */
    ul#slider-one { width: 300px; }
    ul#slider-one > li { width: 150px; }
    div#slider-two { width: <?php echo ((350 - 100) . 'px'); ?>; vertical-align: middle; }
    div#slider-two > div { width: 140px; }
    h2.title { font-size: 0.9em;padding-left: 10%; }
    div.subtitle { font-size: 0.8em; }
    div.text { font-size: 0.85em;width: 80%;padding-left: 10%; }
    div.footer { font-size: 0.55em; font-style: italic; text-align: right; padding-right: 20px; }
    div.textwrap { width: 90%;margin: 0 auto; }
    div.quotation { font-size: 0.8em; text-align: center; font-style: italic; font-family: Times New Roman; }
    h2.htitle { font-size: 0.9em;padding-left: 5%; }
    div.htext { font-size: 0.7em;width: 90%;padding-left: 5%; }
    div.hdedication { font-size: 0.8em; text-align: left; font-style: italic; font-family: Times New Roman; width: 85% !important; }
    div.hfooter { font-size: 0.6em; text-align: right; padding-right: 20px; }
    div.htextwrap { width: 90%;margin: 0 auto; }
    
    div.photo {
      vertical-align: bottom;
      line-height: 35%;
      margin: 0 auto;
      width: 100%;
    }
    div.postcard {
//      border: 10px solid #ddd;
      box-shadow: 0 0 10px #000;
      padding: 2px 0 5px 0;
    }
    div.stampdiv {
      text-align: right;
      vertical-align: top;
      padding: 0;
      margin: 0;
      margin-left: 5%;
      width: 90%;
    }
    div.prize {
      font: bold 28px 黑体;
      color: #fff;
      position: absolute;
      left: 120px;
      top: 5px;
      z-index: 9;
    }
  </style>

</head>
<body>

<div id="wrapper">
  <!-- Slider #2 (images of slider #1 reversed) -->
  <div class="prize">前<?php echo count($items); ?>名赢家奖品</div>
  <div id="slider-two" style="vertical-align: middle !important;">
    <?php 
      foreach ($items as $idx => &$item) {
        echo "
            <div>
              <div class=\"postcard\">
                <div class=\"textwrap\">
                  <h2 class=\"title\"><b><span>第" . ($idx + 1) . "名</span></b></h2>
                  <div class=\"stampdiv\"><img class=\"stampimg\" src=\"$item->path\"></img></div>
                  <div class=\"text\">$item->title<br> 价值$$item->price</div>
                </div>
              </div>
            </div>
          ";
      }
    ?>
    </div>
</div> <!-- end wrapper -->

</body>
</html>
